<template>
  <el-breadcrumb separator-icon="ArrowRight" class="bread">
    <el-breadcrumb-item :to="{ path: '/' }">后台首页</el-breadcrumb-item>
    <el-breadcrumb-item v-for="item in routers" :key="item.path" :to="{ path: item?.path }">
      {{ item?.meta?.title }}
    </el-breadcrumb-item>
  </el-breadcrumb>
</template>

<script>
import router from '@/router'
import { defineComponent, computed } from 'vue'
export default defineComponent({
  name: 'BreadcrumbCom',
  setup() {
    const routers = computed(() => {
      const match = router.currentRoute.value.matched
      return match.filter((item) => item.meta.title)
    })

    return { routers }
  },
})
</script>

<style lang="scss" scoped></style>
